//$(function(){
    ////页面自适应分辨率
    function rem(){
        var whdef = 100/1920;// 表示1920的设计图,使用100PX的默认值
        var wH = window.innerHeight;// 当前窗口的高度
        var wW = document.body.clientWidth || document.documentElement.clientWidth;// 当前窗口的宽度
        var rem = wW * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
        $('html').css('font-size', rem + "px");
        return rem;
    }
    ////多个页面跳转得到传的参数
    function getParameter(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
        var r = location.search.substr(1).match(reg);
        if (r != null) return unescape(decodeURI(r[2])); return null;
    }
    ////将图片转出base64字符串存到数据库
    function getBase64Image(img) {
        var canvas = document.createElement("canvas");
        canvas.width = img.width;
        canvas.height = img.height;
        var ctx = canvas.getContext("2d");
        ctx.drawImage(img, 0, 0, img.width, img.height);
        var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
        var dataURL = canvas.toDataURL("image/"+ext);
        return dataURL;
    }
    ////input上传图片转化
    function getObjectURL(file) {
        var url = null ;
        // 下面函数执行的效果是一样的，只是需要针对不同的浏览器执行不同的 js 函数而已
        if (window.createObjectURL!=undefined) { // basic
            url = window.createObjectURL(file) ;
        } else if (window.URL!=undefined) { // mozilla(firefox)
            url = window.URL.createObjectURL(file) ;
        } else if (window.webkitURL!=undefined) { // webkit or chrome
            url = window.webkitURL.createObjectURL(file) ;
        }
        return url ;
    }

    ///////获取背景图片的主色调
    function getImgColor(){
        var img = document.getElementById('dragBg');
        var colors = RGBaster.colors(img, {
            paletteSize: 30,
            success: function(colors){
                //console.log("Dominant color:", colors.dominant);
                color= colors.dominant;
            }
        });
    }
    //////计算画布大小及缩放
    ////obj：画布对象。setWidth：用户自设置的画布宽，setHeight：用户自设置的画布高，initWidth：默认画布宽，initHeight：默认画布高
    function setCanvasSize(obj,setWidth,setHeight,initWidth,initHeight,flag){
        //console.log(setWidth, setHeight, initWidth, initHeight);
        var percentage;//缩放比例
        var finalWidth,finalHeight;
        ///1、用户设置的画布宽<=1600px 并且 画布高<=900px ，此时不用做缩放 直接设置
        if(setWidth<=initWidth&&setHeight<=initHeight){
           //obj.width(setWidth);
           //obj.height(setHeight);
            finalWidth=setWidth;finalHeight=setHeight;
           //obj.css({width:setWidth/100+"rem",height:setHeight/100+"rem"});
        }
        ///2、用户设置的画布宽<1600px 但是 画布高>900px ，让高=900，计算缩放比例，然后算出缩放后的宽
        if(setWidth<initWidth&&setHeight>initHeight){
            percentage=setHeight/initHeight;
            //obj.width(initHeight*setWidth/setHeight);
            //obj.height(initHeight);
            finalWidth=initHeight*setWidth/setHeight;finalHeight=initHeight;
            //obj.css({width:(initHeight*setWidth/setHeight)/100+"rem",height:initHeight/100+"rem"});

        }
        ///3、用户设置的画布宽>1600px 但是 画布高<900px ，让宽=1600，计算缩放比例，然后算出缩放后的高
        if(setWidth>initWidth&&setHeight<initHeight){
            percentage=setWidth/initWidth;
            //obj.width(initWidth);
            //obj.height(initWidth*setHeight/setWidth);
            finalWidth=initWidth;finalHeight=initWidth*setHeight/setWidth;
            //obj.css({width:initWidth/100+"rem",height:(initWidth*setHeight/setWidth)/100+"rem"});

        }
        ///4、用户设置的画布宽>1600px 但是 画布高>900px ，设缩放比例为x,分别求缩放比例谁的大按照谁的
        if(setWidth>initWidth&&setHeight>initHeight){
            /////1、说明宽高都是等倍数，那么直接设置画布1600*900
            if(setWidth/initWidth==setHeight/initHeight){
                percentage=setWidth/initWidth;
                //obj.width(initWidth);
                //obj.height(initHeight);
                finalWidth=initWidth;finalHeight=initHeight;
                //obj.css({width:initWidth/100+"rem",height:initHeight/100+"rem"});

            }
            /////2、说明宽的缩放比例大，按照宽的缩放比例进行缩放
            if(setWidth/initWidth>setHeight/initHeight){
                percentage=setWidth/initWidth;
                //obj.width(parseInt(setWidth/percentage));
                //obj.height(parseInt(setHeight/percentage));
                finalWidth=parseInt(setWidth/percentage);finalHeight=parseInt(setHeight/percentage);
                //obj.css({width:(parseInt(setWidth/percentage))/100+"rem",height:(parseInt(setHeight/percentage))/100+"rem"});

            }
            /////3、说明高的缩放比例大，按照高的缩放比例进行缩放
            if(setWidth/initWidth<setHeight/initHeight){
                percentage=setHeight/initHeight;
                //obj.width(parseInt(setWidth/percentage));
                //obj.height(parseInt(setHeight/percentage));
                finalWidth=parseInt(setWidth/percentage);finalHeight=parseInt(setHeight/percentage);
                //obj.css({width:(parseInt(setWidth/percentage))/100+"rem",height:(parseInt(setHeight/percentage))/100+"rem"});

            }

        }
        if(flag==0){
            ////说明是拖拽页面调用，此时要判断是否出现滚动条
            IFMinValue();///最后判断最小高和最小宽，是否出现滚动条
        }
        obj.css({width:finalWidth/100+"rem",height:finalHeight/100+"rem"});///设置画布的最终宽高
        //var colNum=finalWidth/10,rowNum=finalHeight/10;
        //changeLineColor(colNum,rowNum);

        /////IFMinValue  判断画布的临界值函数
        function IFMinValue(){
            /////对于宽高比太大的，比如3比1  6比1  7比1  5比1等，越缩放那么高就会越小，此时要判断缩放后的高度是否小于最小值450
            ////画布缩放后的高度小于500 太小了，此时就不考虑缩放，在判断高是否小于900 小于900大于500，就等于自身值，否则大于900直接让高=900，宽度算出来，出现滚动条
            if(finalHeight<500){
                //if(setHeight<900){
                //    finalHeight=setHeight;////说明自身高不到900，那么就直接等于自身高让宽去自适应
                //}else{
                //    finalHeight=900;
                //}
                finalHeight=500;
                finalWidth=setWidth*finalHeight/setHeight;
            }
            /////对于宽高比太大的，比如1比3  1比6  1比7  2比7等，越缩放那么宽就会越小，此时要判断缩放后的宽度是否小于最小值800
            ////画布缩放后的宽度小于1000 太小了，此时就不考虑缩放，
            if(finalWidth<1000){
                //if(setWidth<1600){
                //    finalWidth=setWidth;////说明自身宽不到1600，那么就直接等于自身宽让高去自适应
                //}else{
                //    finalWidth=1600;
                //}
                finalWidth=1000;
                finalHeight=setHeight*finalWidth/setWidth;
            }
        }

    }

    //////更换背景图的同时更换网格颜色
    function changeLineColor(cols_num,rows_num){
        $('canvas').remove();
        var canvasW=$('.dragArea').width();
        var canvasH=$('.dragArea').height();
        $('.grid').append('<canvas id="canvas" width="'+canvasW+'px" height="'+canvasH+'px"></canvas>');
        $('.grid, #canvas').css({width:"100%",height:"100%"});///设置画布的最终宽高
        //$('#canvas').css({width:$('.dragArea').width()+"px",height:$('.dragArea').height()+"px"});///设置画布的最终宽高
        var img = document.getElementById('dragBg');
        var colors = RGBaster.colors(img, {
            paletteSize: 30,
            success: function(colors){
                //console.log(colors.dominant);
                var leftArr=colors.dominant.split("(");
                var num=leftArr[1].split(")")[0];/////leftArr[1]得到 102,102,102)   102,102,102
                var oldNum=num.split(",");
                var newNum=(255-oldNum[0])+','+(255-oldNum[1])+','+(255-oldNum[2]);////取反色拼接新的字符串
                var color=leftArr[0] + "a" + "(" + newNum + ",0.1)";/////最后的rgba(1,1,1,0.1)反色值
                //console.log(color);
                //获取上下文
                var canvas=document.getElementById("canvas");
                var ctx=canvas.getContext("2d");
                //描绘背景
                //    var gradient=ctx.createLinearGradient(0,0,0,300);//createLinearGradient() 方法创建线性的渐变对象。
                //    gradient.addColorStop(0,"#1d2c4c");
                //    gradient.addColorStop(1,"#1d2c4c");
                //    ctx.fillStyle=gradient;
                //    ctx.fillRect=(0,0,canvas.width,canvas.height);
                //描绘边框
                //var grid_cols=80;
                //var grid_rows=60;
                var grid_cols=cols_num;
                var grid_rows=rows_num;
                var cell_height=canvas.height/grid_rows;
                var cell_width=canvas.width/grid_cols;
                ctx.lineWidth=1;
                //ctx.strokeStyle="rgba(102,102,102,0.4)";
                ctx.strokeStyle=color;


                //结束边框描绘
                ctx.beginPath();
                //准备画横线
                for(var col=0;col<=grid_cols;col++)

                {
                    var x=col*cell_width;
                    ctx.moveTo(x+0.5,0.5);
                    ctx.lineTo(x+0.5,canvas.height+0.5);
    //        ctx.moveTo(x-0.5,-0.5);
    //        ctx.lineTo(x-0.5,canvas.height-0.5);

                    ctx.moveTo(x,0);
                    ctx.lineTo(x,canvas.height);

                }
                //准备画竖线
                for(var row=0;row<=grid_rows;row++)
                {
                    var y=row*cell_height;
                    ctx.moveTo(0.5,y+0.5);
                    ctx.lineTo(canvas.width+0.5,y+0.5);
    //        ctx.moveTo(-0.5,y-0.5);
    //        ctx.lineTo(canvas.width-0.5,y-0.5);
                    ctx.moveTo(0,y);
                    ctx.lineTo(canvas.width,y);
                }
                //完成描绘
                ctx.stroke();

            }
        });

    }
    //1、找到当前模块的父盒子，2、找到当前模块父盒子的遮罩，3、找到拖拽的色块 4、找到当前模块盒子
    function divFlex(ClassName){
        //console.log(ClassName+'成功了！');
        var divName=ClassName;
        var currentCanvasW;////记录画布尺寸
        var currentCanvasH;////记录画布尺寸
        var objFlex={
            "title":{"maxW":960,"maxH":70,"minW":480,"minH":35},
            "time":{"maxW":320,"maxH":96,"minW":160,"minH":48},
            "weather":{"maxW":960,"maxH":70,"minW":480,"minH":35},
            "rank":{"maxW":568,"maxH":454,"minW":284,"minH":227},
            "come":{"maxW":406,"maxH":461,"minW":176,"minH":200},
            "style8":{"maxW":822,"maxH":445,"minW":274,"minH":148},
            "borrow":{"maxW":572,"maxH":385,"minW":318,"minH":214},
            "notice8":{"maxW":380,"maxH":393,"minW":190,"minH":196},
            "reco8":{"maxW":400,"maxH":364,"minW":200,"minH":182},
            "history":{"maxW":434,"maxH":355,"minW":217,"minH":178},
            "famous":{"maxW":837,"maxH":58,"minW":418,"minH":29},
            "media":{"maxW":762,"maxH":444,"minW":320,"minH":186}
        };
        var parentBOX=$(window.parent.document).find('.module._'+ClassName+'');/////找到iframe的上层父盒子，拖动模块本身然后去控制其父盒子的尺寸变化
        var parentBOXMask=$(window.parent.document).find('.module._'+ClassName+'').prev();/////找到iframe的上层父盒子，拖动模块本身然后去控制其父盒子的尺寸变化
        var oDiv=document.getElementsByClassName("block")[0];//////获得拖拽的小格子
        var oDiv2=document.getElementsByClassName(''+ClassName+'')[0];///获得整个被作用拖拽的大盒子
        var mouseStart={};
        var divStart={};
        var rightStart={};
        var bottomStart={};
        var iconWidth,fontSize1,fontSize2;
        var obj;
        if(ClassName=="title"){
            obj=objFlex.title;
        }
        if(ClassName=="time"){
            obj=objFlex.time;
        }
        if(ClassName=="weather"){
            obj=objFlex.weather;
        }
        if(ClassName=="rank"){
            obj=objFlex.rank;
        }
        if(ClassName=="come"){
            obj=objFlex.come;
        }
        if(ClassName=="style8"){
            obj=objFlex.style8;
        }
        if(ClassName=="borrow"){
            obj=objFlex.borrow;
        }
        if(ClassName=="notice8"){
            obj=objFlex.notice8;
        }
        if(ClassName=="reco8"){
            obj=objFlex.reco8;
        }
        if(ClassName=="history"){
            obj=objFlex.history;
        }
        if(ClassName=="famous"){
            obj=objFlex.famous;
        }
        if(ClassName=="media"){
            obj=objFlex.media;
        }

        //往左右同时拽
        oDiv.onmousedown=function(ev)
        {
            currentCanvasW=$(window.parent.document).find('.dragArea').width();////每次拖拽获得画布的宽
            currentCanvasH=$(window.parent.document).find('.dragArea').height();////每次拖拽开始获得画布的高
            var oEvent=ev||event;
            mouseStart.x=oEvent.clientX;////鼠标点击的点按下坐标，是到视口的距离
            mouseStart.y=oEvent.clientY;
            divStart.x=oDiv.offsetLeft;////小模块左上角的坐标  距离父盒子的距离
            divStart.y=oDiv.offsetTop;
            if(oDiv.setCapture)
            {
                oDiv.onmousemove=doDrag;
                oDiv.onmouseup=stopDrag;
                oDiv.setCapture();
            }
            else
            {
                document.addEventListener("mousemove",doDrag,true);
                document.addEventListener("mouseup",stopDrag,true);
            }
            iconWidth=$('.module-title img').width();///当鼠标按下时候获取此时标题图片的宽度
            fontSize1=$('.module-title span').css('font-size');///获取标题字体大小
            fontSize2=$('.history_title').css('font-size');///获取正文字体大小
            //$('.module-title img').css({width:iconWidth});///统一设置标题的icon维持当前时刻不变,不随着放大缩小而变化
            //$('.module-title span').css({fontSize:fontSize1});///统一设置标题的字体维持当前时刻不变,不随着放大缩小而变化
            $('.history .history_title, .history .history_time, .history .history_inner').css({fontSize:fontSize2});
            $('.notice8 .notice-content .notice_title, .notice8 .notice-content .notice_text>div').css({fontSize:fontSize2});
            $('.famous .famous-content').css({fontSize:fontSize2});
            //if(ClassName=="borrow"){
            //    myChart = echarts.init(document.getElementById('chart'));
            //    myChart.resize();
            //}
        };
        function doDrag(ev)
        {
            var oEvent=ev||event;
            var l=oEvent.clientX-mouseStart.x+divStart.x;
            var t=oEvent.clientY-mouseStart.y+divStart.y;
            var w=l+oDiv.offsetWidth;
            var h=t+oDiv.offsetHeight;
    //            console.log(w,h);
            if(w<oDiv.offsetWidth)
            {
                w=oDiv.offsetWidth;
            }
            else if(w>document.documentElement.clientWidth-oDiv2.offsetLeft)
            {
                w=document.documentElement.clientWidth-oDiv2.offsetLeft-2;
            }
            if(h<oDiv.offsetHeight)
            {
                h=oDiv.offsetHeight;
            }
            else if(h>document.documentElement.clientHeight-oDiv2.offsetTop)
            {
                h=document.documentElement.clientHeight-oDiv2.offsetTop-2;
            }
            //console.log(parseInt($(parentBOX).height()+$(parentBOX).position().top),parseInt(currentCanvasH-50));
            if(parseInt(h+$(parentBOX).position().top)>=parseInt(currentCanvasH-50)){
                console.log(11111);
                /////当模块高加上top值超过画布高时候高度不在变化
                //h=$(parentBOX).height();
                h=parseInt(currentCanvasH-50-$(parentBOX).position().top);
            }
            if(parseInt(w+$(parentBOX).position().left)>=parseInt(currentCanvasW-50)){
                /////当模块宽加上left值超过画布宽时候宽度不在变化
                //w=$(parentBOX).width();
                w=parseInt(currentCanvasW-50-$(parentBOX).position().left);
            }
            if(w<obj.minW){
                /////当模块高加上top值超过画布高时候高度不在变化
                w=obj.minW;
            }
            if(h<obj.minH){
                /////当模块宽加上left值超过画布宽时候宽度不在变化
                h=obj.minH;
            }
            //console.log(h);
            oDiv2.style.width=w+"px";
            oDiv2.style.height=h+"px";
            $(parentBOX).width(w+4);////多加4防止缩放过快
            $(parentBOX).height(h+4);
            $(parentBOXMask).width(w+4);
            $(parentBOXMask).height(h*0.5);


        };
        function stopDrag()
        {
            if(oDiv.releaseCapture)
            {
                oDiv.onmousemove=null;
                oDiv.onmouseup=null;
                oDiv.releaseCapture();
            }
            else
            {
                document.removeEventListener("mousemove",doDrag,true);
                document.removeEventListener("mouseup",stopDrag,true);
            }
        };
    };
//});








